{{ include './header.html'}}
<body>
    <div id="wrap">  
        {{ include './left.html'}}
        <!-- 右侧具体内容栏目 -->
        <div id="rightContent">
            <div id="personInfor" style="text-align: right; background-color:blanchedalmond;">
                <p id="userName">
                <a> 用户:{{adminname}} </a>
                <a href="/admin/login/loginout">退出</a>
                <a class="meun-item" href="#chan" aria-controls="chan" role="tab" data-toggle="tab"><img
                        src="../../images/icon_change_grey.png">修改密码</a>
                </p>   
            </div>
           
            <!-- Tab panes -->
            <div class="tab-content">
                <!-- 总用户数 -->
                <div role="tabpanel" class="tab-pane active" id="statistical" style="width:1000px;height:250px;">
  
                    <div id="main2" style="width:250px;height:200px;"></div>                   
                    <input id="series2" value="{{@totoluser}}" type="hidden" />
                    <script type="text/javascript">
                        let myChart2 = echarts.init(document.getElementById('main2'));
                        let data = document.getElementById('series2').value;
                        let color = ['#062551', '#5bffff'];
                        let echartData = [{
                            value: 100 - data
                        },
                        {
                            value: data
                        }
                        ];


                        let formatNumber = function (num) {
                            let reg = /(?=(\B)(\d{3})+$)/g;
                            return num.toString().replace(reg, ',');
                        }
                        let total = echartData.reduce((a, b) => {
                            return b.value
                        }, 0);

                        var option2 = {
                            color: color,
                            title: [{
                                text: '{val|' + formatNumber(total) + '}人',
                                top: 'center',
                                left: 'center',
                                textStyle: {
                                    rich: {
                                        // name: {
                                        //     fontSize: 14,
                                        //     fontWeight: 'normal',
                                        //     color: '#00ff00',
                                        //     padding: [10, 0]
                                        // },
                                        val: {
                                            fontSize: 16,
                                            fontWeight: 'bold',
                                            color: '#00ff00',
                                        }
                                    }
                                }
                            }],
                            series: [{
                                type: 'pie',
                                radius: ['50%', '70%'], //控制圆环大小
                                center: ['50%', '50%'],	//控制圆环位置
                                data: echartData,
                                hoverAnimation: false,
                                itemStyle: {
                                    normal: {

                                        borderWidth: 2
                                    }
                                },
                                labelLine: {
                                    normal: {
                                        length: 0,
                                        length2: 0,
                                        lineStyle: {
                                            color: '#e6e6e6'
                                        }
                                    }
                                }
                            }]
                        };

                        myChart2.setOption(option2);
                    </script>
                        <div style="width: 250px;height:50px; text-align: center; color: cyan;">系统用户总数</div>


                </div>

                <!-- 七日曲线 -->
                <div role="tabpanel" class="tab-pane active" id="sour">
                   <div id="main1" style="width: 1000px;height:400px;"></div>
                    <input id="yAxis1" value="{{@number}}" type="hidden" /> 
                    <input id="series1" value="{{@date}}" type="hidden" />
                    <script type="text/javascript">
                    let myChart1 = echarts.init(document.getElementById('main1'));
                    var date = document.getElementById('series1').value;
                    var number = document.getElementById('yAxis1').value;
                    var yAxis1 =  number.split(',');
                    var series1 = date.split(',');

                    var option1 = {
                        title: {
                            text: '近七日打印曲线图'
                        },
                        tooltip: {},
                        legend: {
                            data: ['销量']
                        },
                        xAxis: {
                            type: 'category',
                            data: series1
                        },
                        yAxis: {
                            type: 'value'
                        },
                        series: [{
                            data: yAxis1,
                            type: 'line'
                        }]
                    };

                    myChart1.setOption(option1);
                   </script>
        
                </div>
                
                <!-- 修改密码模块 -->
                {{ include './change_Password.html'}}

                <!--打印统计模块-->
                <div role="tabpanel" class="tab-pane" id="print">

                    <div id="main" style="width: 1000px;height:500px;"></div>
                    <input id="yAxis" value="{{@usertoplistname}}" type="hidden" />
                    <input id="series" value="{{@usertoplistnumber}}" type="hidden" />
                    <script type="text/javascript">
                        let myChart = echarts.init(document.getElementById('main'));
                        var datas = document.getElementById('yAxis').value;
                        var data2 = document.getElementById('series').value;
                        var yAxis = datas.split(',');
                        var series = data2.split(',');

                        var option = {
                            title: {
                                text: '打印次数统计'
                            },
                            tooltip: {
                            },
                            legend: {
                                data: ['打印次数']
                            },
                            xAxis: {
                                type: 'value',
                                splitLine : {   //去掉网格线
                                   show : false
                                },
                                position: 'top',//X轴位置
                                
                            },
                            yAxis: {
                                data: yAxis,
                            },
                            series: [{
                                name: '打印次数',
                                type: 'bar',
                                data: series,
                                label: {
                                    show: true
                                },
                                emphasis: {
                                    focus: 'series'
                                },
                                barWidth: 30,//柱子宽度
                            }]
                        };

                        myChart.setOption(option);
                    </script>
                    
                </div>
  

            </div>
        </div>
    </div>

</body>

</html>